{include file="common:header" /}
{include file="common:side" /}
    <div id="page-wrapper">
      <!-- 舆情日报 -->
      <!--*************************** content部分开始 ******************-->
      <div class="container-fluid" id="m_main">
        <div class="row m-t-20">
          <div class="col-sm-12">
            <div class="white-box">
              <h2 class="box-title m-b-20">编辑学生信息</h2>
              <div class="row">
                <div class="col-sm-4">
                  <div class="form-group">
                    <label class="control-label">学生姓名</label>
                    <input type="text" class="form-control" placeholder="" v-model="user.name">
                  </div>
                </div>
              </div>
              <div class="row">
                <div class="col-sm-4 form-list">
                  <div class="form-group ">
                    <label class="control-label">
                      <div class="btn-group" role="group">
                        <button id="alreadybegin" @click="alreadybegin()" type="button" class="btn btn-primary">已开始的课</button>
                        <button id="willbegin" @click="willbegin()" type="button" class="btn btn-default">未开始的课</button>
                      </div>
                    </label>
                      <ul class="conList" id="alreadybeginlist">
                        {foreach $course_list as $key=>$vo } 
                        <li class="conItem">
                          <input type="checkbox" value="{$vo.id}" {in name="$vo.id" value="$info.course1"}checked{/in} id="cb1" class="ch" @click="checkboxOnclick1()" />
                            <div class="box">
                              <div class="conItemed">
                                <span>课程名称：</span>{$vo.name}
                              </div>
                              <div class="conItemed">
                                <span>课程课时：</span>{$vo.periods}课时
                              </div>
                              <div class="conItemed">
                                <span>课程老师：</span>{$vo.teacher_name}
                              </div>
                              <div class="conItemed">
                                <span>课程校址：</span>{$vo.address}
                              </div>
                              <div class="conItemed">
                                <span>课程班级：</span>{$vo.classes_name}
                              </div>
                              <div class="conItemed">
                                <span>课程教室：</span>{$vo.classroom_name}
                              </div>
                              <div class="conItemed">
                                <span>课程时间：</span>{$vo.class_time_str}
                              </div>
                            </div>
                        </li>
                        {/foreach}
                      </ul>
                      <ul class="conList" id="willbeginlist" style="display: none;">
                        {foreach $course_list as $key=>$vo } 
                        <li class="conItem">
                          <input type="checkbox" value="{$vo.id}" {in name="$vo.id" value="$info.course2"}checked{/in} id="cb2" class="ch" @click="checkboxOnclick2()" />
                            <div class="box">
                              <div class="conItemed">
                                <span>课程名称：</span>{$vo.name}
                              </div>
                              <div class="conItemed">
                                <span>课程课时：</span>{$vo.periods}课时
                              </div>
                              <div class="conItemed">
                                <span>课程老师：</span>{$vo.teacher_name}
                              </div>
                              <div class="conItemed">
                                <span>课程校址：</span>{$vo.address}
                              </div>
                              <div class="conItemed">
                                <span>课程班级：</span>{$vo.classes_name}
                              </div>
                              <div class="conItemed">
                                <span>课程教室：</span>{$vo.classroom_name}
                              </div>
                              <div class="conItemed">
                                <span>课程时间：</span>{$vo.class_time_str}
                              </div>
                            </div>
                        </li>
                        {/foreach}
                      </ul>
                  </div>
                </div>
              </div>
              <!-- <div class="row">
                <div class="col-sm-4 form-list">
                  <div class="form-group ">
                    <label class="control-label">课程学生：</label>
                      <ul class="students-ul">
                        <li class="students-li" v-for="(item,index) in students" :key='index'>
                          <img :src="item.img" alt="">
                          <div class="studentName">{{item.name}}</div>
                        </li>
                      </ul>
                  </div>
                </div>
              </div> -->
              <div class="row m-t-40">
                <div class="col-sm-8 ta-c">
                  <button type="button" name="" class="btn btn-outline btn-primary m-r-40" @click="doSubmit()">提交</button>
                </div>
              </div>
            </div>
          </div>
        </div>

        <!-- /.row -->
      </div>
      <!--*************************** content部分结束 ******************-->

      <!-- <footer class="footer text-center"> 2017 &copy; Ample Admin brought to you by themedesigner.in </footer> -->
    </div>
  {include file="common:js" /}
  {include file="common:footer" /}
  <script src="/web/js/edit.js"></script>

  <script type="text/javascript">
    var vm = new Vue({
      el: '#m_main',
      data() {
        return {
          sid: '{$sid}',
          cid: '{$cid}',
          user: {},
          // students:[{
          //   img:'#',
          //   name:'zhangsan'
          // },
          // {img:'#',
          //   name:'zhangsan'
          // }],
          course_id1: '', // 已开始课程
          course_id2: '', // 未开始课程
        }
      },
      mounted() {
        this.requestData();
        this.checkboxOnclick1();
        this.checkboxOnclick2();
      },
      methods: {
        requestData() {
          let that = this;
          axios.post('/dboard/user/infoData', {cid: that.cid},{headers: {'X-Requested-with':'XMLHttpRequest'}}).then(res => {
            // console.log(res);
            if(res.data.Code == 0){
              that.user = res.data.Data.user;
            }else{
              alert(res.data.Msg)
            }
          }).catch(err => {
            console.log(err);
          })
        },
        // 提交
        doSubmit(){
          var that = this;
          var param = {
            sid: that.sid,
            cid: that.cid,
            name: that.user.name,
            course_id1: that.course_id1,
            course_id2: that.course_id2,
          }
          axios.post('/dboard/user/editUserinfo', param,{headers: {'X-Requested-with':'XMLHttpRequest'}}).then(res => {
            // console.log(res);
            if(res.data.Code == 0){
              //请求成功
              alert(res.data.Msg);
              window.location.href = '/dboard/students/lists';
            }else{
              alert(res.data.Msg)
            }
          }).catch(err => {
            console.log(err);
          })
        },
        checkboxOnclick1(){
          var course_id1 = '';
          var A = $('#cb1:checked')
          A.each(function(i){
            course_id1 = course_id1+$(this).val().toString()+',';
          })
          this.course_id1 = course_id1;
        },
        checkboxOnclick2(){
          var course_id2 = '';
          var A = $('#cb2:checked')
          A.each(function(i){
            course_id2 = course_id2+$(this).val().toString()+',';
          })
          this.course_id2 = course_id2;
        },
        alreadybegin() {
          $('#alreadybegin').removeClass('btn-default').addClass('btn-primary');
          $('#willbegin').removeClass('btn-primary').addClass('btn-default');
          $('#alreadybeginlist').show();
          $('#willbeginlist').hide();
        },
        willbegin() {
          $('#willbegin').removeClass('btn-default').addClass('btn-primary');
          $('#alreadybegin').removeClass('btn-primary').addClass('btn-default');
          $('#willbeginlist').show();
          $('#alreadybeginlist').hide();
        }
      }
    })
  </script>
  

